<template>
    <div>
      <h2>温州理工滨海校区</h2>
      <input v-model="studentId" type="text" placeholder="请输入学号" />
      <button @click="searchStudent">搜索</button>
      <div v-if="student">
        <h3>学生信息</h3>
        <p>学号: {{ student.id }}</p>
        <p>姓名: {{ student.name }}</p>
        <p>年龄: {{ student.age }}</p>
        <p>专业: {{ student.major }}</p>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        studentId: '',
        student: null
      };
    },
    methods: {
      searchStudent() {
        const students = [
          { id: '24219141132', name: '蒋璐瑶', age: 18, major: '计算机科学与技术' },
          { id: '24219141141', name: '郑川', age: 21, major: '计算机科学与技术' }
        ];
        this.student = students.find(student => student.id === this.studentId) || null;
      }
    }
  };
  </script>
  
  <style scoped>
  input, button {
    margin: 10px;
    padding: 5px;
  }
  </style>